<template>
  <div>
    <Content />
    <button @click="msg='Hello'">点击变换</button>
  </div>
</template>

<script>
import Content from './Content.vue'
export default {
  data() {
    return {
      msg: '父组件数据',
      obj: {
        msg: '父组件数据'
      }
    }
  },
  // provide如果想要访问组件实例中的属性，需要写成函数形式return一个对象
  // provide/inject本身不是一个响应式的(单项数据流)
  // 可以通过响应式对象的方式或者是函数返回响应式数据
  provide() {
    return {
      // msg: this.msg
      // obj: this.obj
      msg: () => this.msg
    }
  },
  components: {
    Content
  }
}
</script>

<style>
</style>